<template>
  <div class="about">
    {{ about }}
    {{ list }}
    {{ $store.state['SEARCH'].name }}
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
// import axios from "axios";
@Component({
  head() {
    return {
      title: this.about
    };
  },
  layout: "search",
  async asyncData({app}) {
    const {
      status,
      data: { list }
    } = await app.$axios.get("http://localhost:3000/search/list");
    console.log(status, list);
    if (status === 200) {
      return {
        list
      };
    }
  } 
})
export default class Search extends Vue {
  about: string = "This is about page";
}
</script>

<style scoped lang='stylus'  rel='stylesheet/stylus'>
.about
  color #3b8070
</style>